@import "tailwindcss";
@import "tw-animate-css";

@theme {
  --color-primary: #4662ac;
  --color-secondary: #7B61FF;
  --color-success: #00B42A;
  --color-warning: #FF7D00;
  --color-danger: #F53F3F;
  --background: 0 0% 100%;
  --foreground: 240 10% 3.9%;
  --muted: 240 4.8% 95.9%;
  --muted-foreground: 240 3.8% 46.1%;
  --popover: 0 0% 100%;
  --popover-foreground: 240 10% 3.9%;
  --card: 0 0% 100%;
  --card-foreground: 240 10% 3.9%;
  --border: 240 5.9% 90%;
  --input: 240 5.9% 90%;
  --primary: 240 5.9% 10%;
  --primary-foreground: 0 0% 98%;
  --secondary: 240 4.8% 95.9%;
  --secondary-foreground: 240 5.9% 10%;
  --accent: 240 4.8% 95.9%;
  --accent-foreground: 240 5.9% 10%;
  --destructive: 0 84.2% 60.2%;
  --destructive-foreground: 0 0% 98%;
  --ring: 240 5.9% 10%;
}

.bg-background {
  background-color: hsl(var(--background))
}

.border-input {
  border-color: hsl(var(--input));
}

.hover\:bg-accent:hover {
  background-color: hsl(var(--accent))
}

.hover\:text-accent-foreground:hover {
  color: hsl(var(--accent-foreground))
}